.wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
    grid-template-rows: 200px 200px 200px 200px;
    grid-template-areas:
        ". header  ."
        "sidebar content content"
        "yeelow red red"
        "footer footer footer";
}

.one {
    background: #19CAAD;
    grid-area: sidebar;
}

.two {
    background: #8CC7B5;
    grid-area: red;
}

.three {
    background: #D1BA74;
    grid-area: content;
}

.four {
    background: #BEE7E9;
    grid-area: header;
}

.five {
    background: #E6CEAC;
    grid-area: yeelow;

}

.six {
    background: #ECAD9E;
    grid-area: footer;

}